<!--
 * @Descripttion: 引流设置
 * @Author: xiao li
 * @Date: 2020-07-06 12:17:07
 * @LastEditors: xiao li
 * @LastEditTime: 2021-04-29 11:38:54
-->
<template>
    <div class="lb-sys-sproconfig">
        <top-nav></top-nav>
        <div class="page-main">
          <lb-tips>
            <p>只可开启一个引流平台使用，提交审核时请关闭此功能</p>
          </lb-tips>
            <el-table
            v-loading="loading"
            :data="tableData"
          :header-cell-style="{background:'#f5f7fa',color:'#606266'}"
            style="width: 100%">
            <el-table-column
              prop="key"
              width="200px"
              label="引流平台">
            </el-table-column>
            <el-table-column
              prop="token"
              label="链接/口令">
                <template slot-scope="scope">
                  <el-input type="textarea" :rows="4" v-model="scope.row.token" :placeholder="`请输入${scope.row.key}链接（淘口令）`" v-if="scope.row.key === '淘宝'"></el-input>
                  <el-input type="textarea" :rows="4" v-model="scope.row.token" :placeholder="`请输入${scope.row.key}链接`" v-else></el-input>
                </template>
            </el-table-column>
            <el-table-column
              prop="status"
              label="是否启用">
              <template slot-scope="scope">
                <el-switch
                v-model="scope.row.status"
                :active-value='1'
                :inactive-value='0'
                @change='settingDefaultCard(scope.row.status,scope.row.id)'>
              </el-switch>
              </template>
            </el-table-column>
          </el-table>
          <lb-button type='primary' @click="submitFormInfo()">{{$t('action.save')}}</lb-button>

        </div>
    </div>
</template>

<script>
export default {
  data () {
    return {
      tableData: []
    }
  },
  created () {
    this.getFormInfo()
  },
  methods: {
    async getFormInfo () {
      let param = ['抖音', '淘宝']
      let {data} = await this.$api.closureInfo(param)
      this.tableData = data
    },
    async settingDefault (status, id) {
      alert(status)
      let data = JSON.parse(JSON.stringify(this.tableData))
      data.map((item, index) => {
        item.status = 0
        if (id === item.id) {
          item.status = status === 1 ? 0 : 1
        }
      })
      this.tableData = data
    },
    submitFormInfo () {
      let {tableData} = this
      this.$api.closureUpdate(tableData).then(res => {
        if (res.code === 200) {
          this.$message.success(this.$t('tips.successSub'))
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
    .el-textarea {
      width: 400px;
    }
</style>
